(async function(){
    const resp=await API.profile();
    if(!resp.data){
        alert('您还未登录,或登录已过期,请重新登录');
        location.href='./login.html';
        return
    }
    const close=document.querySelector('.close');
    const nickname=document.querySelector('#nickname');
    const loginId=document.querySelector('#loginId');
    const chatContainer=document.querySelector('.chat-container');
    const form=document.querySelector('.msg-container');
    const input=document.querySelector('#txtMsg');
    close.addEventListener('click',()=>{
        logout();
        alert('退出成功');
        location.href='./login.html'
    })
    setUserData();
    getHistory();
    form.addEventListener('submit',function(e){
        e.preventDefault();
        sendChat(input.value);
        input.value='';
    })
    function logout(){
        API.loginOut();
    }
    function setUserData(){
        nickname.innerText=resp.data.nickname;
        loginId.innerText=resp.data.loginId;
    }
    function bottomScroll(){
        chatContainer.scrollTop=chatContainer.scrollHeight
    }
    async function getHistory(){
        const historyData=await API.getHistory();
        for (const item of historyData.data) {
            addChat({
                content:item.content,
                createdAt:item.createdAt,
                from:item.from,
                to:item.to
            })
        }
        bottomScroll();
    }
//     content: "你几岁啦？"
//   createdAt: 1651213093992
//   from: "haha"
//   to: null
    function addChat(messageInfo){
        const chat=document.createElement('div');
        chat.className='chat-item';
        if(messageInfo.from){
            chat.classList.add('me');
        }
        const img=document.createElement('img');
        img.className='chat-avatar';
        messageInfo.from?img.src='./asset/avatar.png':img.src='./asset/robot-avatar.jpg';
        const content=document.createElement('div');
        content.className='chat-content';
        content.innerText=messageInfo.content;
        const date=document.createElement('div');
        date.className='chat-date';
        date.innerText=formate(messageInfo.createdAt);
        chat.appendChild(img);
        chat.appendChild(content);
        chat.appendChild(date);
        chatContainer.appendChild(chat);
    }
    async function sendChat(content){
        addChat({
            content,
            createdAt:Date.now(),
            from:resp.data.nickname,
            to:null
        })
        bottomScroll();
        const reply=await API.sendChat(content);
        addChat({
            content:reply.data.content,
            createdAt:reply.data.createdAt,
            from:null,
            to:reply.data.nickname
        })
        bottomScroll();
    }
    function formate(unixTime){
        const date=new Date(unixTime);
        const year=date.getFullYear().toString();
        const month=(date.getMonth()+1).toString().padStart(2,'0');
        const day=date.getDate().toString().padStart(2,'0');
        const hour=date.getHours().toString().padStart(2,'0');
        const minute=date.getMinutes().toString().padStart(2,'0');
        const second=date.getSeconds().toString().padStart(2,'0');
        return `${year}-${month}-${day} ${hour}:${minute}:${second}`
    }
})()